@charset "UTF-8";

html{width: 100%;}
body{font:500 14px/1.3 "microsoft yahei",Microsoft YaHei,sans-serif;}
.arrowUp:before{border-bottom-color:#666;left:0;top:0;}
.arrowUp:after{border-bottom-color:#fff;left:0;top:1px;}
.arrowDown:before{border-top-color:#666;left:0;bottom:0;}
.arrowDown:after{border-top-color:#fff;left:0;bottom:1px;}
.arrowLeft:before{border-right-color:#666;top:0;left:0;}
.arrowLeft:after{border-right-color:#fff;top:0;left:1px;}
.arrowRight:before{border-left-color:#666;top:0;right:0;}
.arrowRight:after{border-left-color:#fff;top:0;right:1px;}
a:hover .arrowUp:before{border-bottom-color:#ce3f51;}
a:hover .arrowDown:before{border-top-color:#ce3f51;}
a:hover .arrowLeft:before{border-right-color:#ce3f51;}
a:hover .arrowRight:before{border-left-color:#ce3f51;}
a{color:#000;text-decoration:none;}
/*a:visited{color:#000;text-decoration:none;}*/
a:hover{color:#ff4c4c;text-decoration:none;}
a:active{color:#ff4c4c;text-decoration:none;}
.red{color: #f00;}
.pd10{padding: 0 10px;}
.comWidth{width: 1200px; margin: 0 auto;}
.icon{background: url(../images/icon_s.png) no-repeat; display: inline-block;}
.mainWrap{padding-top: 138px;}
.videoPlayBtn{display: block; width: 90px; height: 90px; position: absolute; left: 50%; top: 50%; margin-left: -45px; margin-top: -58px; cursor: pointer; background: url(../images/play_btn.png) no-repeat;}
img{
	max-height: 100%;
	vertical-align: middle;
	cursor: pointer;  
    /*transition: all 0.6s;*/
}
.magnifyImg{
	overflow: hidden;
}
.magnifyImg img{
	transition: all 1s;
	-webkit-transition: all 1s;
}
.magnifyImg img:hover{  
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
}
.magnifyImgs{
	overflow: hidden;
}
.magnifyImgs img{
	transition: transform 12s cubic-bezier(.23, 1, .32, 1); transform: scale(1);
}
.magnifyImgs img:hover{  
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
}
.-image--fixed {
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center;
}
/** header **/
.header{position: fixed; height: 138px; z-index: 999; background: #fff; width: 100%; box-shadow: 0px 2px 6px 4px rgba(109, 109, 109,.4);}
.topBarBox{background: #4c4c4c;}
.topBar{height: 40px; line-height: 40px; color: #fff; background: #4c4c4c;}
.topBar a{color: #fff;}
.navWrap{height: 98px;}
.logoBox{margin-top: 16px;}
.navList{margin-top: 18px;}
.navItem{display: inline-block; position: relative; z-index: 1; line-height: 80px;}
.navItem .arrowUp{display: none;}
.navItem.hover .arrowUp{display:inline-block; position: absolute; left: 50%; margin-left: -3px; bottom: 0px;}
.navItem.hover .arrowUp:before{border-bottom-color: #d90000;}
.navSubWrap{position: absolute; width: 100%; background: #f0f0f0; border-top: 1px solid #d90000; margin-top: -1px;}
.navSubWrap .none{display: none;}
.navSubList{display: block; width: 100%; padding-left: 425px;}
.comWidth .navSubList:nth-child(1){ padding-left: 100px;}
.comWidth .navSubList:nth-child(2){ padding-left: 190px;}
.comWidth .navSubList:nth-child(3){ padding-left: 550px;}
.comWidth .navSubList:nth-child(4){ padding-left: 490px;}
.comWidth .navSubList:nth-child(5){ padding-left: 0px; text-align: right;}
.comWidth .navSubList:last-child{ padding-left: 870px;}
.navSubList a{display: inline-block; line-height: 50px; margin: 0 20px; font-size: 16px;}
.navList form{display: inline-block; margin: 0px 10px; width: 145px; height: 32px; line-height: 32px; background: #f5f5f5;  -moz-border-radius:15px; -ms-border-radius:15px; -webkit-border-radius: 15px; border-radius:15px; position: relative; top: 9px;}
.navList form .textbox{float: left; margin-left: 10px; width: 100px; height: 32px; line-height: 32px; border: 0 none; background: none; color: #679efe;}
.navList form .submit{ width: 32px; height: 32px; border: 0 none; background: url(../images/top-icon3.png) no-repeat 50% 50%; text-indent: -999px; cursor: pointer;}


.iconHome{background-position: 0 -193px; width: 28px; height: 28px; vertical-align: sub; margin-right: -8px;}
span.cur .iconHome{background-position: 0 -30px;}
.navItem > a{font-size: 18px; display: inline-block; padding: 0 10px 0 10px; border-right: 1px solid #999; line-height: 1;}
.navList .cur a{color: #d90000;}
.iconSearch{background-position: 0 -70px; display: inline-block; width: 20px; height: 20px; margin-left: 8px; vertical-align: -2px;}
/** header **/

/** footer **/
.footer{background: #383838;}
.footWrap{padding: 50px 40px;}
.floor2{ border-top: 1px solid #484848; padding-top: 22px; padding-bottom: 40px;}
.floor2 p{color: #e6e6e6;}
.floor2 p a{color: #e5e5e5;}
.floor2 p a:hover{color: #ff4c4c;}
.footLeft{float: left; width: 260px;}
.fStock, .fTell{margin-top: 50px;}
.iconStock{background-position: 0 -102px; width: 36px; height: 36px; vertical-align: bottom; margin-right: 14px;}
.stockTxt span{display: block; color: #e5e5e5;}
.iconTel{background-position: 0 -144px; width: 37px; height: 37px; vertical-align: bottom; margin-right: 14px;}
/*.footRight{margin-left: 300px;}*/
.footNav{padding: 0 20px; border-left: 1px solid #484848; min-height: 214px;}
.footNav dt{color: #fff; font-size: 18px; margin-bottom: 18px;}
.footNav dt a{color: #fff;}
.footNav dd{line-height: 32px; color: #e5e5e5;}
.footNav dd::before{content: "•"; padding-right: 5px; color: #808080;}
.footNav dd a{color: #e5e5e5;}
.footNav dd a:hover{color: #ff4c4c;}
.fqrcode{height: 86px;}
.footNav:last-child{border-left: none;}
.footNav:last-child dd::before{content: ""}
/** footer **/

/** 通用面包屑导航及二级菜单 **/

#nav {
    position: relative;
    top: -138px; // 偏移值
    display: block;
    height: 0;
    overflow: hidden;
}
.navigatWrap{background: #f5f5f5;}
.navigation{line-height: 70px; color: #888;}
.navigation a{color: #888;}
.navigation a:hover{color: #ff4c4c;}
.subNavItem{display: inline-block; height: 61px; text-align: center; padding: 0 38px; position: relative; border-radius: 3px;}
.subNavItem span{color: #444; line-height: 60px;}
.subNavItem span.navEnTxt{margin-top: 8px;}
.subNavWrap{text-align: center; padding: 28px 0 50px;}
.subNavWrap a.cur{background: #ff4c4c;}
.subNavWrap a.cur span{color: #fff;}
.subNavItem:hover span{color:#ff4c4c;}
.subNavItem .arrowDown{display: none;}
.subNavWrap a.cur .arrowDown{display: inline-block; position: absolute; bottom: -6px;left: 50%; margin-left: -3px;}
.subNavWrap a.cur .arrowDown:before{border-top-color: #ff4c4c;}
.subNavWrap a.cur .arrowDown:after{border-top-color: #ff4c4c;}
.navCnTxt{font-size: 18px;}
/** 通用面包屑导航及二级菜单 **/

/** 通用分页 **/
.page-area {clear: both;margin: 30px auto;letter-spacing: -0.34em;text-align: center;}
.pages,.page-area a, .page-area span, .page-area i, .page-area input { display: inline-block; *display: inline; zoom: 1; vertical-align: top; letter-spacing: normal; text-align: center; }
.page-area .prev, .page-area .next {width: 28px;height: 26px;line-height: 26px;border: 1px solid #d5d5d5;margin-left: 10px;}
.page-area .page-number a {margin-left: 10px;width: 26px;height: 26px;line-height: 26px;border: 1px solid #d5d5d5;}
.page-area .page-number i { margin-left: 10px; }
.page-area .page-number a.on {background: #ff4c4c;color: #ffffff;border: 1px solid #ff4c4c;}
.page-area .textbox {margin-left: 8px;margin-right: 8px;padding-left: 10px;padding-right: 10px;width: 20px;height: 25px;line-height: 25px;border: 1px solid #c9c9c9;}
.page-area .button {margin-left: 10px;width: 50px;height: 26px;line-height: 26px;background: #ff4c4c;color: #ffffff;border: 1px solid #ff4c4c;font-size: 14px;font-family: "Microsoft YaHei";cursor: pointer;border-radius: 4px;}
.page-area .tj { padding-left: 10px; padding-right: 10px; height: 26px; line-height: 26px; }
.page-area .button-area { padding-left: 10px; padding-right: 10px; height: 26px; line-height: 26px; }
/** 通用分页 **/


/*自定义一个透明度从0到1的动画，它的名称是fade-in*/
@keyframes fade-in{  
    0%{ opacity: 0;}
    100%{opacity:1;}
}
@-webkit-keyframes fade-in{
    0%{ opacity: 0;}
    100%{opacity:1;}
}
@-ms-keyframes fade-in{
    0%{ opacity: 0;}
    100%{opacity:1;}
}
@-o-keyframes fade-in{
    0%{ opacity: 0;}
    100%{opacity:1;}
}
@-moz-keyframes fade-in{
    0%{ opacity: 0;}
    100%{opacity:1;}
}
.animation-block .animate-2 {
    -ms-transition: 1s ease;
    -webkit-transition: 1s ease;
    transition: 1s ease;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -ms-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    opacity: 1;
    -ms-transform: translate(0, 50px);
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
    -ms-transition-delay: .1s;
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
}

.animation-block .animate-3 {
    -ms-transition: 1s ease;
    -webkit-transition: 1s ease;
    transition: 1s ease;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    opacity: 1;
    -ms-transform: translate(0, 50px);
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
    -ms-transition-delay: .2s;
    -webkit-transition-delay: .2s;
    transition-delay: .2s;
}

.animation-block .animate-4 {
    -ms-transition: 1s ease;
    -webkit-transition: 1s ease;
    transition: 1s ease;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    opacity: 1;
    -ms-transform: translate(0, 50px);
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
    -ms-transition-delay: .3s;
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
}

.animation-block .animate-5 {
    -ms-transition: 1s ease;
    -webkit-transition: 1s ease;
    transition: 1s ease;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    opacity: 1;
    -ms-transform: translate(0, 50px);
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
    -ms-transition-delay: .4s;
    -webkit-transition-delay: .4s;
    transition-delay: .4s;
}

.animation-block .animate-6 {
    -ms-transition: 1s ease;
    -webkit-transition: 1s ease;
    transition: 1s ease;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    opacity: 1;
    -ms-transform: translate(0, 50px);
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
    -ms-transition-delay: .5s;
    -webkit-transition-delay: .5s;
    transition-delay: .5s;
}

.animation-block .animate-7 {
    -ms-transition-delay: .6s;
    -webkit-transition-delay: .6s;
    transition-delay: .6s
}

.animation-block .animate-8 {
    -ms-transition-delay: .7s;
    -webkit-transition-delay: .7s;
    transition-delay: .7s;
}

.animation-block .animate-9 {
    -ms-transition-delay: .8s;
    -webkit-transition-delay: .8s;
    transition-delay: .8s;
}

.animation-block .animate-10 {
    -ms-transition-delay: .9s;
    -webkit-transition-delay: .9s;
    transition-delay: .9s;
}
.animation-block.animated .animate-1,.animation-block.animated .animate-2,.animation-block.animated .animate-3,.animation-block.animated .animate-4 {
    opacity: 1;
    -ms-transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}